<template>
  <!-- 内容盒子 -->
  <view class="opinion-poll-root" :style="'height:' + windowHeight + 'px'">
    <top-back-image-container style="width: 100%;height: max-content"
                              :image-path="`${baseFilePath}/home/cloudBasedRepresentation.png`"></top-back-image-container>
    <view class="content">
      <view class="into-container">
        <view class="row-txt text-content row-container">
          一、人民群众可以向代表委员反映与自身生产生活密切相关的民生小事和维护公共利益的具体问题。
        </view>
        <view class="row-txt text-content row-container">
          二、人民群众应当围绕经济社会发展中群众普遍关心的问题，向代表委员提出建议或意见。
        </view>
        <view class="row-txt text-content row-container">
          三、下列情况人民群众民意诉求不受理:
          <view class="row-txt text-content">
            (一)涉及申诉、控告、检举的;
          </view>
          <view class="row-txt text-content">
            (二)需通过法律途径解决的;
          </view>
          <view class="row-txt text-content">
            (三)属于产品推介等涉及个人利益的;
          </view>
          <view class="row-txt text-content">
            (四)其他不适宜向代表委员提出的事项。
          </view>
        </view>
        <view class="row-txt text-contentrow-container">
          四、人民群众向代表委员留言，应当表明事项的主要内容和具体要求，留下联系方式，便于答复反馈。
        </view>
		<view class="row-txt text-contentrow-container">
		  五、代表委员收到人民群众留言后，应当依法、及时进行处理。
		</view>
      </view>

      <!-- 内容 end -->
    </view>
    
    <view class="footer">
      <button @click="showOpinionPoll" type="button">民意处理流程说明</button>
    </view>
  </view>
</template>

<script>
import TopBackImageContainer from "@/compontent/topBackImageContainer/index.vue";
import {opinionReactionPath,publicOpinionProcess} from "@/until/publicConfig";
import {baseMixins} from "@/mixins/baseMixins";

export default {
  mixins:[baseMixins],
  components: {TopBackImageContainer},
  data() {
    const {
      windowHeight
    } = uni.getSystemInfoSync()
    return {
      windowHeight,
      isPetition:''
    }
  },
  onLoad(params) {
    this.isPetition = params.isPetition
  },
  methods: {
    showOpinionPoll(){
      uni.redirectTo({url: `${publicOpinionProcess}?isPetition=${this.isPetition}`})
    }
  }
}
</script>

<style lang='scss' scoped>
.opinion-poll-root {
  width: 750rpx;
  display: flex;
  flex-direction: column;

  .banner {
    height: 300rpx;

    image {
      width: 100%;
      height: 100%;
    }
  }

  .content {
    height: calc(100% - 420rpx);
    flex-grow: 1;
    color: #222222;
    position: relative;

    .into-container {
      width: 100%;
      box-sizing: border-box;
      position: relative;
      top: -20rpx;
      background: #fff;
      border-radius: 10rpx;
      padding: 30rpx;

      .row-txt {
        width: 100%;

        &.row-container {
          margin-top: 30rpx;
        }
      }
    }
  }

  .footer {
    height: 120rpx;
    padding: 10rpx 50rpx;
    box-sizing: border-box;
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    background-color: #FFFFFF;
    z-index: 10;
    box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.3);

    button {
      width: 100%;
      height: 80%;
      display: flex;
      justify-content: center;
      align-items: center;
      border-radius: 50rpx;
      color: #FFFFFF !important;
      background: linear-gradient(to bottom, #FA4D37, #C01600) !important;
    }
  }
}


</style>
